<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>Form Component</title>
		<!-- Bootstrap core CSS -->
		<link href="css/bootstrap.min.css" rel="stylesheet">
		<link href="css/bootstrap-reset.css" rel="stylesheet">
		<!--external css-->
		<link href="assets/font-awesome/css/font-awesome.css" rel="stylesheet" />

		<link rel="stylesheet" type="text/css" href="assets/bootstrap-datepicker/css/datepicker.css" />
		<link rel="stylesheet" type="text/css" href="assets/bootstrap-colorpicker/css/colorpicker.css" />
		<link rel="stylesheet" type="text/css" href="assets/bootstrap-daterangepicker/daterangepicker.css" />

		<!-- Custom styles for this template -->
		<link href="css/style.css" rel="stylesheet">
		<link href="css/style-responsive.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="reset.css" />
	</head>

	<body>
		<!--会议车辆开始-->
		<div role="tabpanel" class="tab-pane " id="meeting">
			<form class="form-horizontal tasi-form" id="meeting_apply">
				<!--会议名称-->
				<div class="form-group">
					<label class="col-sm-2 control-label" for="meeting_title">会议名称：</label>
					<div class="col-sm-7">
						<input type="text" class="form-control" required="required" placeholder="请输入或者选择会议名称" v-model='meeting_title' id="meeting_title" name="meeting_title">
					</div>
					<button type="button" class="btn btn-primary" @click='SelectTitle()' data-toggle='modal' data-target='#meeting_show' id="meeting_select">已有会议选择</button>
				</div>
				<!-- 会议选择结束 -->				
				<!--车辆信息-->
				<div class="form-group meet_carinfo" id="meeting_conference0" style="position: relative;">
					<button type="button" class="btn btn-primary" @click="meeting_addConferenceInfo()" style="position: absolute;right:10%;top: 5px;">新增参会单位</button>
					<label class="col-sm-2  control-label" style="text-align: right !important; font-size: 20px; margin: 3px 0;">承办方信息&#x3000;</label>
					<div class="clear" style="height: 20px;"></div>
					<!--添加删除车辆按钮-->
					<i class="icon-plus-sign icon-2x" style="top: 65px;position: absolute;right: 10%;z-index: 10000;" @click="AddMeetingCar()"></i>
					<i class="icon-minus-sign icon-2x" style="bottom: 30px;position: absolute;right: 10%;z-index: 10000;" v-show='host_cars.length > 1' @click="RemoveMeetingCar()"></i>
					<div class="clear"></div>
					<!--单个车辆信息-->
					<label class="col-sm-2 control-label host_label">承办方车牌号：</label>
					<div class="col-sm-9 licence">
						<template v-for="(item,index) in host_cars">
							<select v-model='item.province' class="form-control m-bot15 col-sm-3 province">
								<option value="鄂">鄂</option>
								<option value="京">京</option>
								<option value="津">津</option>
								<option value="沪">沪</option>							
							</select>
							<select v-model='item.type' class="form-control m-bot15 col-sm-3 type">
								<option value="A" >A</option>
								<option value="B">B</option>
								<option value="C">C</option>
								<option value="D">D</option>
								<option value="E">E</option>							
							</select>
							<template v-if="index == 0 && host_cars.length ==1">
								<input class="form-control carID col-sm-5" type="text" v-model='item.carID'  placeholder="请输入车牌后五位，如12345">
							</template>
							<template v-else>
								<input class="form-control carID col-sm-5"  type="text" v-model='item.carID' v-on:input='checkedValid($event)' pattern="[0-9 A-Z a-z]{5}"  required="required" placeholder="请输入车牌后五位，如12345">
							</template>
							<div class="clear"></div>
						</template>
					</div>
					<div class="clear"></div>
					<!--添加车辆区域-->
					<div class="meeting_addcars"></div>
					<!--添加完成-->
				</div>
				<!--车辆信息结束-->
				<!--添加车辆信息-->
				<div id="meeting_conferences">
					<!--单个车辆信息-->
						<template v-for='(item,index) in applyList'>
							<div class="form-group meet_carinfo" id="meeting_conference{{num}}">
										<button type="button" class="btn btn-danger" @click="removeConferenceInfo(item,index)" style="position: absolute;right: 10%;top: 5px;">删除车辆信息</button>
										<label class="col-sm-2  control-label" style="text-align: right !important; font-size: 20px; margin: 3px 0;">参会单位信息&#x3000;</label>
										<div class="clear"></div>
										<div class="form-group">
											<label class="col-sm-2 control-label ">参会单位：</label>
											<div class="col-sm-9">
												<input name="" type="text" class="form-control" v-model='item.apply_title' placeholder="请输入参会单位" style="margin-bottom: 1px;">
											</div>
										</div>
										<!--添加删除车辆按钮-->
										<i class="icon-plus-sign icon-2x" style="top: 95px;position: absolute;right: 10%;z-index: 10000;" @click="AddApplyCar(item)"></i>
										<i class="icon-minus-sign icon-2x" style="bottom: 30px;position: absolute;right: 10%;z-index: 10000;" v-show='item.apply_cars.length > 1' @click="RemoveApplyCar(item)"></i>
										<div class="clear"></div>	
										<template v-for='car in item.apply_cars'>
											<div class="form-group">
												<label class="col-sm-2 control-label">参会车牌号：</label>
												<div class="col-sm-9 licence">
													<select class="form-control m-bot15 col-sm-3 province" v-model='car.license.province'>
														<option value="鄂" selected="selected">鄂</option>
														<option value="京">京</option>
														<option value="津">津</option>
														<option value="沪">沪</option>
														<option value="渝">渝</option>																								
													</select>
													<select class="form-control m-bot15 col-sm-3 type" v-model='car.license.type'>
														<option value="A" selected="selected">A</option>
														<option value="B">B</option>
														<option value="C">C</option>
														<option value="D">D</option>																						
													</select>
													<div class="col-sm-5">
														<span style="position: absolute;left: 0px;top: 5px;">—</span>
														<input name="{{time}}" class="form-control carID " type="text" v-model='car.license.carID' required="required" >												
													</div>
												</div>
												<label class="col-sm-2 control-label ">移动电话：</label>
													<div class="col-sm-9">
														<input name="{{time/1000}}" type="text" class="form-control "  v-model='car.tel'>
													</div>
												<div class="clear"></div>
											</div>												
										</template>										
										<!--添加完成-->
										<!--单个车辆信息结束-->
									</div>
						</template>
				</div>				
				<!--车辆信息添加完成-->
				<div class="form-group">
					<label class="control-label col-sm-2" style="padding-top: 5px;">授权时间：</label>
					<div class="col-sm-9">
						<div class="col-sm-6" style="padding-left: 0;">
							<select class="form-control m-bot15 col-sm-8" v-model='start_day' v-on:change='ChangeEnd($event)'>
								<option v-for="item in start_days" v-bind:value="item">{{item}}</option>
							</select>
							<select class="form-control m-bot15 col-sm-4" v-model='start_hour' id="start_hour" name="start_hour">
								<option value="2">02:00</option>
								<option value="3">03:00</option>
								<option value="4">04:00</option>
								<option value="5">05:00</option>
								<option value="6">06:00</option>
								<option value="7">07:00</option>
								<option value="8">08:00</option>							
							</select>
						</div>
						<div class="col-sm-6" style="padding-right: 0;">
							<span class="pull-left" style="position: absolute;left: -6px;top: 3px;"> 至 </span>
							<select class="form-control m-bot15 col-sm-8" v-model='end_day'>
								<option v-for="item in end_days" v-bind:value="item">{{item}}</option>
							</select>
							<select class="form-control m-bot15 col-sm-4" v-model='end_hour' id="end_hour" name="end_hour">								
								<option value="14">14:00</option>
								<option value="15">15:00</option>
								<option value="16">16:00</option>
								<option value="17">17:00</option>
								<option value="18">18:00</option>
								<option value="19">19:00</option>
								<option value="20">20:00</option>
								<option value="21">21:00</option>
								<option value="22">22:00</option>
								<option value="23">23:00</option>
							</select>
						</div>
					</div>
					<div style="clear: both;"></div>
				</div>
				<div class="form-group">
					<div class="col-sm-3 col-sm-offset-3 text-center">
						<button type="button" @click='submitApply()' id="meeting_submit" class="btn btn-primary" style=" padding:7px 45px;">提交申请</button>
						<input type="submit" id="submit" style="display: none;" />
					</div>
				</div>
			</form>
			<!--模态框-->
			<!--会议名称列表选择 模态框-->
			<div aria-hidden="true" aria-labelledby="myModalLabel" role="dialog" tabindex="-1" id="meeting_show" class="modal fade myModal reload">
				<div class="modal-dialog">
					<div class="modal-content">
						<div class="modal-body" style="padding: 40px 0;">
							<div class="form-group">
								<label class="col-sm-3 control-label">会议名称：</label>
								<div class="col-sm-8">
									<select class="form-control m-bot15" v-model='selected_title' >
										<template v-for="item in select_meeting_title">
											<option v-bind:value="item">{{item}}</option>
										</template>
									</select>
								</div>
							</div>
						</div>
						<div class="modal-footer">
							<button data-dismiss="modal" id="meeting_selected" @click='meeting_title=selected_title' class="btn btn-primary" type="button">确定</button>
						</div>
					</div>
				</div>
			</div>
			<!--模态框结束-->
		</div>
		<!--会议车辆结束-->

		<!-- js placed at the end of the document so the pages load faster -->
		<script src="js/jquery.js"></script>
		<script src="js/bootstrap.min.js"></script>
		<script src="js/jquery.scrollTo.min.js"></script>
		<script src="js/jquery.nicescroll.js" type="text/javascript"></script>

		<script src="js/jquery-ui-1.9.2.custom.min.js"></script>
		<script class="include" type="text/javascript" src="js/jquery.dcjqaccordion.2.7.js"></script>

		<!--custom switch-->
		<script src="js/bootstrap-switch.js"></script>
		<!--custom tagsinput-->
		<script src="js/jquery.tagsinput.js"></script>
		<!--custom checkbox & radio-->
		<script type="text/javascript" src="js/ga.js"></script>

		<script type="text/javascript" src="assets/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
		<script type="text/javascript" src="assets/bootstrap-daterangepicker/date.js"></script>
		<script type="text/javascript" src="assets/bootstrap-daterangepicker/daterangepicker.js"></script>
		<script type="text/javascript" src="assets/bootstrap-colorpicker/js/bootstrap-colorpicker.js"></script>
		<script type="text/javascript" src="assets/ckeditor/ckeditor.js"></script>

		<script type="text/javascript" src="assets/bootstrap-inputmask/bootstrap-inputmask.min.js"></script>
		<script src="js/respond.min.js"></script>

		<!--common script for all pages-->
		<script src="js/common-scripts.js"></script>

		<!--script for this page-->
		<script src="js/form-component.js"></script>
		<script src="vue.min.js"></script>
		<script src="vue-resource.min.js"></script>
		<!--<script src="component.js"></script>-->
		<script type="text/javascript" src="add.js"></script>
	</body>

</html>